﻿
@{
    ViewBag.Title = "知识专题";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="layui-container p0 mt15">
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md8">
            <div id="dot_special_list"></div>

            <script id="dot_tmp_special_list" type="text/x-dot-template">
                <div class="list-title">知识专题</div>
                <div class="article-list">
                    {{? it.length }}
                    {{ for(var idx in it) { if(it[idx].ID) { var elm = it[idx]; }}
                    <div class="row p20p10 bcolor oa">
                        <div class="layui-col-md3">
                            <a href="/article/SpecialList/{{= elm.ID }}@(ViewBag.Suffix)">
                                <img src="{{= fileurl + elm.Img }}" alt="" style="width:100%;" onerror="imageError(event)">
                            </a>
                        </div>
                        <div class="layui-col-md9">
                            <div class="new-panle">
                                <a href="/article/SpecialList/{{= elm.ID }}@(ViewBag.Suffix)">
                                    <div class="panle-title ahover">{{= elm.Name }}</div>
                                </a>
                                <div class="panle-info">
                                    <span>
                                        <i class="layui-icon">&#xe637;</i> {{= elm.CreateTime }}
                                    </span>
                                    <a href="/Page/Index/{{= elm.Number }}@(ViewBag.Suffix)" class="href" style="font-size:12px;" target="_blank">
                                        <i class="layui-icon" style="font-size:13px;">&#xe612;</i> {{= elm.UserName }}
                                    </a>
                                    <span style="margin-left:10px;">
                                        <i class="layui-icon">&#xe615;</i> {{= elm.ClickAmount }}
                                    </span>
                                </div>
                                <div class="panle-content">
                                    {{= elm.Content }}
                                </div>
                            </div>
                        </div>
                    </div>
                    {{ } } }}
                    {{?? }}
                    <div class="row p20p10 bcolor oa">{{= noDataTitle }}</div>
                    {{? }}
                </div>
            </script>

            <div id="page" class="row p20p10 oa tcenter"></div>
        </div>
        <div class="layui-col-md4">
            <div class="row layui-hide-xs">
                <div class="layui-tab layui-tab-brief bcolor oa">
                    <ul class="layui-tab-title">
                        <li class="layui-this">推荐专题</li>
                    </ul>
                    <div class="layui-tab-content pb0">
                        <div class="layui-tab-item layui-show" id="dot_hot_spe"></div>

                        <script id="dot_tmp_hot_spe" type="text/x-dot-template">
                            {{? it.length }}
                            {{ for(var idx in it) { if(it[idx].ID) { var elm = it[idx]; }}
                            <div class="row oa pbt10 bt">
                                <div class="layui-col-md3">
                                    <a href="/article/SpecialList/{{= elm.ID }}@(ViewBag.Suffix)">
                                        <img src="{{= fileurl + elm.Img }}" alt="" style="width:100%;" onerror="imageError(event)">
                                    </a>
                                </div>
                                <div class="layui-col-md9">
                                    <div class="new-panle">
                                        <a href="/article/SpecialList/{{= elm.ID }}@(ViewBag.Suffix)">
                                            <div class="ahover">{{= elm.Name }}</div>
                                        </a>
                                        <div class="panle-info">
                                            <span>
                                                <i class="layui-icon">&#xe615;</i> {{= elm.ClickAmount }}
                                            </span>
                                        </div>
                                        <div class="panle-content">
                                            {{= elm.Content }}...
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {{ } } }}
                            {{?? }}
                            <div class="row oa pbt10 bt">{{= noDataTitle }}</div>
                            {{? }}
                        </script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    var carousel = layui.carousel, element = layui.element;
    var special = new Special();
    $(function () {
        special.getData();
        special.getHotSpe();
    });

    function Special() {
        this.paras = {
            page: 1,
            rows: 10,
            count: 0
        };
        this.option = {
            elem: 'page'
        };
        this.getData = function (isLoad, next) {
            if (isLoad) { this.paras.page = next; }
            var this_obj = this;
            $.post('/article/GetSpecialListResult', this_obj.paras, function (result) {
                this_obj.paras.count = result.count;
                if (!isLoad) { this_obj.setPage(); }
                if (result.succ) {
                    var dotTmp = doT.template($("#dot_tmp_special_list").text());
                    $("#dot_special_list").html(dotTmp(result.data));
                } else {
                    layer.msg(result.msg);
                }
            });
        };
        this.setPage = function () {
            var this_obj = this;
            layui.laypage.render({
                elem: this_obj.option.elem,
                count: this_obj.paras.count,
                limit: this_obj.paras.rows,
                theme: '#FF5722',
                layout: ['prev', 'page', 'next'],
                jump: function (obj, first) {
                    if (!first) {
                        var index = obj.curr;
                        this_obj.getData(true, index);
                    }
                }
            });
        };
        this.getHotSpe = function () {
            $.post('/article/GetHotSpecialResult', {}, function (result) {
                var dotTmp = doT.template($("#dot_tmp_hot_spe").text());
                $("#dot_hot_spe").html(dotTmp(result.data));
            });
        };
    };

</script>